import { reactive, ToRefs, toRefs } from "vue";
class TableMixins<T> {
	protected table: { data: T[]; page: number; page_size: number; total_count: number; loading: boolean; query?:any};
	protected api: Function;
	constructor({api}){
		this.api=api;
		this.table=reactive({
			data:[],
			page: 1,
			page_size: 20,
			total_count: 0,
			loading: false
		})
	}

	public async getTableData(){
		let { page, page_size,query} = this.table;
		this.table.loading = true;
		this.api({
			page,
			page_size,
			...query
		}).then(res=>{
			this.table.data = res.data.list;
			this.table.total_count = res.data.total_count;
		}).finally(()=>{
			this.table.loading = false;
		});

	}

	protected pageChange(e){
		this.table.page=e;
		this.getTableData()
	}

	protected sizeChange(e){
		this.table.page_size=e;
		this.getTableData()
	}

	protected resetQuery(){
		this.table.page=1
		this.table.query={}
		this.getTableData()
	}
}

export default TableMixins
